<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        input {
            border-bottom-style: none;
            border-top-style: none;
            border-left-style: none;
            border-right-style: none;
        }

        .contentBody {
           width: 100%;
           box-sizing: border-box;
        }

        .container {
            width: 100%;
        }

        input.tytdrq {
            width: 96%;
            text-align: center;
        }

        input.tytdqm {
            width: 96%;
            text-align: center;
        }

        input.tytd {
            width: 92%;
            text-align: center;
        }

        input.tytddf {
            width: 95%;
            text-align: center;
        }

        .wzxx1 {
            font-size: 18px;
            font-weight: 600;
            margin-top: 5px;
        }

        .wzxx2 {
            font-size: 15px;
        }

        td {
            font-size: 14px;
        }

        .bgbt {
            font-size: 18px;
            margin-top: 8px;
            margin-bottom: 4px;
            font-weight: 600;
        }

        .wb {
            display: inline-block;
            float: right;
            margin-top: 16px;
        }

        .wb input {
            border-bottom-style: outset;
            border-top-style: none;
            border-left-style: none;
            border-right-style: none;
        }

        .hhl_button {
            padding-top: 12px;
            width: 100%;
            text-align: right;
        }

        .save_button {
            margin-right: 50px;
        }
    </style>
    <script src="/static/js/jquery.js"></script>
    <script src="/static/js/LodopFuncs.js"></script>
    <script src="/static/js/html2canvas.js"></script>
    <script src="/static/js/My97DatePicker/WdatePicker.js"></script>
</head>
<body>
<div id="loading">

</div>
<div id='box'>
    <input id="postoperationDay" type="hidden" />
    <input id="isEdit" type="hidden" />
    <h3>再植指（趾）血循环观察记录单</h3>
    <div id='lists'>
        <div style="height: 32px;margin-bottom:10px"><button id="print" class='btn-emr btn-emr-default'>打印</button>
            <button id="addlist" class='btn-emr btn-emr-green'>添加</button>
            <button id="save" class='btn-emr btn-emr-green'>保 存</button>
            <span id="remarks">*注：先保存数据再生成护理记录</span>
        </div>
        <div style="display: none" id="printBox">


            <table  border="1" cellpadding="0" cellspacing="0">
                <thead>
                <tr>
                    <th>日期时间</th>
                    <th style="width:50px;min-width:50px">术后天数</th>
                    <th>部位</th>
                    <th style="width:50px;min-width:50px">皮温</th>
                    <th>指腹张力</th>
                    <th style="width:50px;min-width:50px">颜色</th>
                    <th>毛细血管反应</th>
                    <th style="width:50px;min-width:50px">肿胀</th>
                    <th>切口放血颜色</th>
                    <th style="width:80px;min-width:80px">签名</th>
                    <!--                           <th>备注</th>-->
                    <!--                            <th id='addlist'>添加</th>-->
                </tr>
                </thead>

                <tbody id="printList">
                </tbody>



            </table>
        </div>
        <div id="printItem">
            <table id="inputBoxTab" border="1" cellpadding="0" cellspacing="0">
                <thead>
                <tr>
                    <th>日期时间</th>
                    <th>术后天数</th>
                    <th>部位</th>
                    <th>皮温</th>
                    <th>指腹张力</th>
                    <th>颜色</th>
                    <th>毛细血管反应</th>
                    <th>肿胀</th>
                    <th>切口放血颜色</th>
                    <th>签名</th>
                    <th>备注</th>
                    <th >操作</th>
                </tr>
                </thead>

                <tbody id="dataList">
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
<script>
    (function ($) {
        let Page = {};
        // var argUrl = getRequestUrl(window.location.href);
        Page.Event = {
            staff: {//登录人信息
                name: $('#inpatientName ').text(),
                staffid: $('.member-info-body p', parent.document).data('staffid'),
                wardcode: $(".member-info-name").attr("data-wardcode"),
                hospital_id: $(".member-info-name").data("hospitalid"),
                bedNum: $("#bedNumber").text(),
                age: $('.icon-age', parent.document).text()
            },
            init: function () {
                this.getDetail()
                $("#xm").text(Page.Event.staff.name)
                $("#xb").text($("#inpatientGender").val())
                $("#nl").text(Page.Event.staff.age)
                $("#ch").text(Page.Event.staff.bedNum)
                $("#zyh").text($("#patientNum").text() || '')
                $("#ks").text($("#patientDepartmentName").text() || '')
                this.pageEvent()
            },
            pageEvent: function () {
                let that = this;
                $("input[name='date']").on('click', function () {
                    WdatePicker({
                        dateFmt: 'MM/dd'
                    });
                });
                $("input[name='time']").on('click', function () {
                    WdatePicker({
                        dateFmt: 'HH:mm'
                    });
                });
                $("button[id='save']").on('click', function () {
                    that.save();
                });
                $("button[id='print']").on('click', function  () {
                    that.print();
                });
                $(".btnSignNurs").on("click", function () {
                    var url = "/customPage/edit?menuShortName=nurseSign";
                    // 打开签名页面获取回写
                    var id = $(this).attr("id");
                    layer.open({
                        type: 2,
                        title: '签名',
                        shift: '',
                        content: url + "&isShowStaff=true&parentDomId=" + id,
                        area: ['300px', '210px'],
                        success: function () {
                        },
                        zIndex: '200',
                        scrolling: 'no'
                    });
                });
            },
            save: function () {
                let save = {};
                let that = this;
                //输入信息保存
                $("input[type='text']").each(function () {
                    save[$(this).attr('id')] = $(this).val()
                });
                //多选信息保存
                $("input[type='checkbox']:checked").each(function () {
                    save[$(this).attr('id')] = $(this).val()
                })
                //单选信息保存
                $("input[type='radio']:checked").each(function () {
                    save[$(this).attr('id')] = $(this).val()
                })
                var _args = {
                    // inpatientId:argUrl.inpatientId,
                    hospitalId: Page.Event.staff.hospital_id,
                    assessmentType: 'trsrmyy_ylpgb',
                    assessmentTime: new Date().Format("yyyy-MM-dd,hh:mm:ss"),
                    assessmentId: Page.Event.staff.staffid,
                    assessmentName: Page.Event.staff.name,
                    assessmentDetail: JSON.stringify(save),
                }
                if ($("#recordId").val()) {
                    _args['assessmentDataId'] = $("#recordId").val()
                    that.saveItem('/template/cnStructuredCustomData/update', _args)
                } else {
                    that.saveItem('/template/cnStructuredCustomData/save', _args)

                }
                console.log(_args);
            },
            //调取保存或者修改接口
            saveItem: function (url, param) {
                let that = this
                $.ajax({
                    url: url,
                    async: false,
                    type: 'POST',
                    contentType: "application/json;charset-utf-8",
                    data: JSON.stringify(param),
                    success: function (res) {
                        if (res.state == 200) {
                            layer.msg('保存成功')
                            that.getDetail()
                        }
                    },
                    error: function (msg) {
                        layer.error("保存发生异常!", msg.responseText);
                    }
                });
            },
            //获取详情
            getDetail: function () {
                $.ajax({
                    type: "get",
                    url: '/template/cnStructuredCustomData/getListByCondition',
                    data: {
                        // inpatientId: argUrl.inpatientId,
                        assessmentType: "trsrmyy_ylpgb",
                    },
                    contentType: "application/json;charset=utf-8"
                }).done(function (res) {
                    if (res.state == 200) {
                        if (res.results.result && res.results.result.length > 0) {
                            $("#recordId").val(res.results.result[0].assessmentDataId)
                            let dataItem = JSON.parse(res.results.result[0].assessmentDetail)
                            //数据回显
                            for (let key in dataItem) {
                                //输入信息保存
                                $("input[type='text']").each(function () {
                                    if ($(this).attr('id') == key && key != 'recordId') {
                                        $(this).val(dataItem[key])
                                        $(this).attr('value', dataItem[key])
                                    }
                                })
                                //勾选信息保存
                                $("input[type='checkbox']").each(function () {
                                    if ($(this).attr('id') == key) {
                                        $(this).prop('checked', true)
                                        $(this).attr('checked', 'checked')
                                    }
                                })
                                //单选信息保存
                                $("input[type='radio']").each(function () {
                                    if ($(this).attr('id') == key) {
                                        $(this).prop('checked', true)
                                        $(this).attr('checked', 'checked')
                                    }
                                })
                            }
                        }
                    }
                })
            },
            print: function () {
                document.getElementById('contentBody').style = "width:290mm";
                html2canvas(document.querySelector("#contentBody"),{
                    dpi: 600,
                    allowTaint: true,
                    imageTimeout: 500,
                    useCORS: true,
                    scale: 2
                }).then(canvas => {
                    document.getElementById('contentBody').style = "width:100%";
                    var imgUrl = canvas.toDataURL("image/png"); // 将canvas转换成img的src流
                    // document.getElementById('myImg').src = imgUrl;
                    LODOP.PRINT_INIT("");
                    LODOP.SET_PRINT_PAGESIZE(2, 0, 0,'A4');
                    LODOP.SET_PRINT_STYLE('AngleOfPageInside',-90)
                    LODOP.SET_PRINT_STYLE("Stretch",1);
                    LODOP.ADD_PRINT_IMAGE('2%','2%','96%', '96%',"<img src="+imgUrl+"/>");
                    LODOP.PREVIEW();
                });
            }
        }
        Page.Event.init();
    })(jQuery);
</script>
</html>
